<script setup lang="ts">

// 定义普通的数据即可
const info = '么么哒'
const htmlStr = '<button>点我试试</button>'

</script>



<template>

<div>
  <!-- 普通文本 V-html和V-text没有区别 标签内部不能写数据 会被覆盖(无意义) -->
  <p v-text="info"></p>
  <p v-html="info"></p>

  <!-- 针对 HTML标签如果要解析 需要 V-html -->
  <p v-html="htmlStr"></p>
  <p v-text="htmlStr"></p>

  <!-- 无论是v-html还是 v-text都会覆盖 子元素 (内容就会被替换) -->
  <!-- 不希望被替换的话  推荐使用插值表达式 {{  }}  html 不会被解析 -->
  <h2>插值表达式</h2>
  <p>我是P标签{{ htmlStr }}</p>
</div>

</template>



<style scoped>

</style>